<template>
  <h1>{{ msg }}</h1>
  <a-button type="button" @click="count++">count is: {{ count }}</a-button>
  <div style="padding: 16px;">
    <h3>下面是关于electron的功能{{ platform }}</h3>
    <a-button @click="showNotification">显示系统消息</a-button>
    <a-button @click="setTheme('dark')">切换为黑暗主题</a-button>
    <a-button @click="setTheme('light')">切换为明亮主题</a-button>
  </div>
</template>

<script setup>
import { ref } from 'vue'

defineProps({
  msg: String,
})

const count = ref(0)
const platform = window.electronAPI.platform
// 系统消息
const showNotification = () => {
  window.electronAPI.showNotification({
    title: '通知标题',
    body: `count value is: ${count.value}`,
  })
}
// 设置主题
const setTheme = (themeName) => {
  window.electronAPI.setTheme(themeName)
}
</script>

<style lang="less" scoped></style>
